 <template>
<div class="swiper">
	<swiper :options="swiperOption">
      <swiper-slide v-for="item of headerImg" :key="item.id"><img class="imgsy" :src="item.imgUrl"></swiper-slide>    
    </swiper>
    <div class="swiper-pagination"></div> <!-- //标页码 -->
    
   <!--   <div class="swiper-scrollbar"></div> //滚动条
    <div class="swiper-button-next"></div> //下一项
    <div class="swiper-button-prev"></div> //上一项 -->
    
</div>
</template>
<script>
export default {
  name: 'homeSwiper',
  data(){
  	return{
      headerImg:[
       {
        id:'001',
        imgUrl:'//dimg04.c-ctrip.com/images/zg061e000001fhjax0F93.jpg'
        },

        {
        id:'002',
        imgUrl:'///dimg04.c-ctrip.com/images/zg0r1d000001e7f6mB662.jpg'
        }
      ],
  		swiperOption:{
  			pagination:'.swiper-pagination',
  			loop:true,
        // initialSlide:0,
        autoplay: 3000, //自动播放
        // effect : 'flip', //旋转播放
  		}
  	}
  }
 
}
</script>

<style scoped lang="stylus">
.swiper  >>>  .swiper-pagination-bullet
    background: #fff
.imgsy
    width: 100%
.swiper-pagination

   position:relative
   top:-.3rem

</style>
